<template>
	<view class="order-info">
		<view class="order-item">
			<view class="label"> 订单编号 </view>
			<view class="value"> 
				{{orderInfo.order_sn}} 
				<image class="copy" src="/static/icon/order/copy.png" @tap="copy(orderInfo.order_sn)" />
			</view>
		</view>
		<view class="order-item">
			<view class="label"> 下单时间 </view>
			<view class="value"> {{orderInfo.create_time}} </view>
		</view>
		<view class="order-item" v-if="orderInfo?.pay_type">
			<view class="label"> 支付方式 </view>
			<view class="value"> {{orderInfo?.pay_type}} </view>
		</view>
		<view class="order-item">
			<view class="label"> 预约送货时间 </view>
			<view class="value"> {{orderInfo.pick_time?orderInfo.pick_time:'暂无'}} </view>
		</view>
		<view class="order-item">
			<view class="label"> 发货时间 </view>
			<view class="value"> {{orderInfo.take_time?orderInfo.take_time:'暂无'}} </view>
		</view>
		<view class="order-item">
			<view class="label"> 收货时间 </view>
			<view class="value"> {{orderInfo.sent_time?orderInfo.sent_time:'暂无'}} </view>
		</view>
	</view>
</template>

<script setup>
	const props = defineProps(['orderInfo'])
	const copy = (info) => {
	  uni.setClipboardData({
	  	data: info,//要被复制的内容
	  	success:() => {//复制成功的回调函数
        getApp().globalData.toast('复制成功')
	  	}
	  });
	}
	console.log(props.orderInfo);
</script>

<style scoped lang="scss">
	.order-info {
		padding: 20px 12px 10px;
		background-color: #fff;
		color: #999999;
		border-radius: 10px;
		margin-bottom: 10px;
		.order-item {
			display: flex;
			justify-content: space-between;
			margin-bottom: 12px;
			&:nth-last-of-type(1) {
				margin-bottom: 0;
			}
			.label {
				color: #666666;
				font-size: 14px;
				font-weight: 400;
				line-height: 19px;
			}
			.value {
				color: #333333;
				font-size: 14px;
				font-weight: 400;
				line-height: 17px;
				.copy {
					width: 16px;
					height: 16px;
				}
			}
		}
	}
</style>